<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<title>main—index-TL</title>
		<!-- css代码 start -->
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link href="../../css/global.css" rel="stylesheet" />
		<link href="../../css/style.css" rel="stylesheet" />
		<link href="../../css/task.css" rel="stylesheet" />
		<style type="text/css">
			#div {
				width: 0px;
				height: 0px;
				background: red;
				position: fixed;
				top: 65%;
				left: 50%;
			}
			/*移除底部或顶部三角,需要在删除此代码*/
			.mui-popover .mui-popover-arrow:after {
				width: 0px;
			}
			/*刷新按钮样式*/
			.sel{
				font-size: 12px;
				margin-left: 10px;
				color: #ffffff;
				background: #ea1e1a;
				height: 20px;
				line-height: 12px !important;
				margin-top: 14px;
				border-radius: 5px;
				padding: 5px;
			}
			.selectxx{
				position: absolute;
				right: 5px;
			}
		</style>
		<!-- css代码 end -->
	</head>
	<body>
		
		<div id="div"></div>
		<div id="popover" class="mui-popover shadow popover">
			<p class="title" id="title"></p>
			<div class="btn_box">
				<span class="fl" onclick="closepop()">取消</span>
				<span class="fr red" id="quedingupdate">确定</span>
			</div> 
		</div>
		
		<div><img src="../../images/send_logo1.png" width="100%" style="pointer-events:none;"/></div>
		<!-- <ul class="TL_bar autoHeight">
			<li><span class="i_1" id="xingming"></span></li>
			<li><span class="i_2" id="xiujia"></span></li>
			<li><span class="i_3" id="xiujiacaozuo"></span></li>
		</ul> -->
		<div class="task_info">
			<div class="info">
				
				<p class="name" style="width: 200px;">
					<span id="xingming"></span>
					<img src="../../images/icon_201.png" />
					<span id="xiujia" class="xiujia" style="margin-left: 10px;"></span>
				</p>
				<p class="wid"><span id="xiujiacaozuo" class="xiujiacaozuo" style="padding: 8px 10px;font-size: 14px;margin-right: -39px;"></span></p>
				
		
			</div>
		</div>
		<ul class="TL_bar autoHeight">
			<li><span class="i_1" id="dpg">待派工(<em id="dispatch">0</em>)</span></li>
			<li><span class="i_2" id="djs">待接受(<em id="accept">0</em>)</span></li>
			<li><span class="i_3" id="jxz">进行中(<em id="inProgress">0</em>)</span></li>
		</ul>
		<!-- html代码 start -->
		
		<div class="mui-content TL_map" id="container" style="height: 64%;">
			<p class="wid" style="width: 24%;position: absolute;z-index: 900;right: 0;top: 20px;">
				<span onclick="selectFseLocation()" class="xiujiacaozuo" style="padding: 8px 10px;">刷新数据</span>
			</p>
		</div>
		<!-- html代码 end -->

		<!-- js代码 start -->

		<!-- 基础js start -->
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/utils/h.js"></script>
		<script src="../../js/constant.js"></script>
		<script src="../../js/common.js"></script>
		<script src="../../js/utils/base64.js"></script>
		<script src="../../js/utils/md5.js"></script>
		<script src="../../js/utils/sortMap.js"></script>
		<script src="../../js/utils/http.js"></script>
		<script src="../../js/app.js"></script>
		<!-- 基础js end -->
		<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=1ca9acc9d0ea8d20406b89acb63c2b4a"></script>

		<script type="text/javascript" charset="utf-8">
			var xiujia
			
			// 取消方法 关闭弹窗
			function closepop(){
				mui("#popover").popover('hide', document.getElementById("div"));
			}
			
			// 点标记集合
			var markers = [];
			// 创建地图实例
			var map = new AMap.Map('container', {
				zoom: 10,//级别
				center: [121.473658,31.230378],//中心点上海
				resizeEnable: true,
				offset: new AMap.Pixel(-13, -30)
			});
			
			// 初始化
			(function($, doc) {
				$.init();
				$.plusReady(function() {
					// 查询fse实时位置
					selectFseLocation() 
					
					// 待派工查询
					h("#dpg").tap(function(){
						app.jumpTo("/view/service/assign/assignList.html", "view/service/assign/assignList.html",
						null);
					});
					
					// 待接受查询
					h("#djs").tap(function(){
						// app.jumpTo("/view/main/indexFSE.html", "view/main/indexFSE.html",
						// {
						// 	state: "0"
						// });
						app.jumpTo("/view/service/assign/acceptList.html", "view/service/assign/acceptList.html",null);
					});
	
					// 进行中查询
					h("#jxz").tap(function(){
						app.jumpTo("/view/service/assign/conductList.html", "view/service/assign/conductList.html",null);
					});
					
					// 休假、结束休假 按钮操作
					h("#xiujiacaozuo").tap(function(){
						var title = "";
						if(xiujia!="3"){
							title = "确定要进行休假吗？";
						}else{
							title = "确定要结束休假吗？";
						}
						h("#title").html(title)
						mui("#popover").popover('toggle', document.getElementById("div"));
					})
					
					h("#quedingupdate").tap(function(){
						var workday;
						if(xiujia!="3"){
							workday = "3";
						}else{
							workday = "1";
						}
						app.showWaiting();
						ajaxGet(BASE_URL + "cc/user/updateUserWorkday", {
							"enginnerId": app.getUser().enginnerId,
							"workday": workday
						}, function(data) {
							app.closeWaiting()
							if (data.code == 200) {//查询成功
								app.toast("操作成功");
								if(workday!="3"){
									h("#xiujia").css({'color':'green'});
									h("#xiujia").html("(状态：工作中)");
									h("#xiujiacaozuo").html("我要休假");
								}else{
									h("#xiujia").css({'color':'#d16866'});
									h("#xiujia").html("(状态：休假)");
									h("#xiujiacaozuo").html("结束休假");
								}
								xiujia = workday;
							}else{
								app.toast(data.msg);
							}
							mui("#popover").popover('toggle', document.getElementById("div"));
						}, function(errorMsg) {
							app.closeWaiting();
							app.toast(data.msg);
						});
					})					
				
					var offlineFlag = h.getItem("offlineFlag");
					if(offlineFlag == "1"){
						app.closeWaiting()
						app.jumpTo("/view/offline/list.html", "view/offline/list.html");
						return;
					}
				});
			}(mui, document));
			
			// 查询fse实时位置
			function selectFseLocation() {
				// 清空点及弹窗
				closeInfoWindow();
				if(markers && markers.length>0) {
					map.remove(markers);
					markers = [];
				}
				// 获取代派工，待接受和进行中的数量
				getMyTeamCount();
				
				var teamleaderId = app.getUser().enginnerId;
				// 查询post
				app.showWaiting('加载中...')
				ajaxGet(BASE_URL + "cc/location/getFseLocation", {"TeamleaderId": teamleaderId}, function(data) {
					app.closeWaiting()
					if (data.code == 200) {//查询成功
						if (data.data && data.data.length > 0) {
							addMarker(data.data);
						}
					} else {//查询失败
						
					}
				}, function(errorMsg) {
					app.closeWaiting()
					console.log(JSON.stringify(errorMsg))
				});
			}
			
			// 标记Fse实时坐标点
			function addMarker(data){
				for (var i = 0; i < data.length; i ++) {
					if (data[i].online != "0" && data[i].postx && data[i].postx != 0 && data[i].posty && data[i].posty != 0) {
						var marker = new AMap.Marker({
							map: map,
							extData : {
								"data": data[i]
							},
							// icon: '../../images/icon_91.png',
							autoRotation: true,
							topWhenClick: true,
							position: [data[i].postx, data[i].posty]
						});
						marker.id = data[i].enginnerId;
						marker.on('click', markerClick);
						markers.push(marker);
					}
				}
				//适应窗口
				map.setFitView();
			}
			
			// mark点击事件处理
			function markerClick(e) {
				var info;
				if (e.target) {
					info = e.target.getExtData().data;
				} else {
					info = e.extData.data;
				}
				showInfoWindow(e,info,info.address);
				// var lnglat = [info.postx,info.posty];
				// getAddress(lnglat).then(value => {
				// 	// 显示内容
				// 	showInfoWindow(e,info,value)
				// }).catch(reason => {
				// 	// 失败了
				// 	showInfoWindow(e,info,reason)
				// })
			}
			
			// 打开标记点信息窗体
			function showInfoWindow(e, info, address) {
				var name = info.name != null ? info.name : '';
				var mobile = info.mobile != null ? info.mobile : '';
				//构建信息窗体中显示的内容
				var content = [];
				content.push("FSE姓名：" + name);
				content.push("手机号：" + mobile);
				content.push("地址：" + address);
				infoWindow = new AMap.InfoWindow({
				    content: content.join("<br/>"),  //使用默认信息窗体框样式，显示信息内容
					offset: new AMap.Pixel(0, -22)
				});
				// infoWindow.on('open',showInfoOpen)
				// infoWindow.on('close',showInfoClose)
				infoWindow.open(map, e.target.getPosition());
			}
			
			// 关闭信息窗体
			function closeInfoWindow() {
				map.clearInfoWindow();
			}
			
			// 信息窗体打开回调
			function showInfoOpen(){
			}
			
			// 信息窗体关闭回调
			function showInfoClose(){
			}
			
			//获取地址信息
			function getAddress(lnglat){
				return new Promise((resolve, reject) => {
					AMap.plugin('AMap.Geocoder', function () {
						var geocoder = new AMap.Geocoder();
						geocoder.getAddress(lnglat, function(status, result) {
							if (status === 'complete' && result.info === 'OK') {
								// result为对应的地理位置详细信息
								resolve(result.regeocode.formattedAddress)
							} else {
								reject("地理位置获取失败")
							}
						});
					});
				})
			}
			
			function getUserInfo(){
				ajaxGet(BASE_URL + "cc/user/checkUserWorkDay", {"enginnerId": app.getUser().enginnerId}, function(data) {
					console.log(JSON.stringify(data))
					if (data.code == 200) {//查询成功
						h("#xingming").html(data.data[0].name);
						xiujia = data.data[0].workday==undefined?"":data.data[0].workday;
						if(xiujia!="3"){
							h("#xiujia").css({'color':'green'});
							h("#xiujia").html("(状态：工作中)");
							h("#xiujiacaozuo").html("我要休假");
						}else{
							h("#xiujia").css({'color':'#d16866'});
							h("#xiujia").html("(状态：休假)");
							h("#xiujiacaozuo").html("结束休假");
						}
					} 
				}, function(errorMsg) {
					console.log(JSON.stringify(errorMsg))
				});
			}
			
			// 查询代派工，待接受和进行中的数量
			function getMyTeamCount() {
				// 查询实时工作状态
				getUserInfo();
				
				ajaxGet(BASE_URL + "cc/notice/getMyTeamPlanCount", {
					"EnginnerId": app.getUser().enginnerId,
				}, function(data) {
					if (data.code == 200) {
						h("#dispatch").html(data.data.daizhipai);
						h("#accept").html(data.data.daijieshou);
						h("#inProgress").html(data.data.jinxingzhong);
					}
				}, function(errorMsg) {
					// console.log(JSON.stringify(errorMsg))
				});
			}
			
		</script>
		<!-- js代码 end -->
	</body>
</html>
